<template>
	<view class="content">
		<view class="info-con">
			<view class="user-lista">
				<u-avatar :src="src" size="55"></u-avatar>
				<view class="list-texta">
					<view style="font-weight: 500;color: #fff;font-size: 31rpx;">
						<u--text color="#fff" mode="name" :text="selectUser.patientName" format="encrypt"></u--text>
					</view>
					<view v-if="selectUser.patientName">
						就诊卡号：{{selectUser.patientCard.substr(0, 1) + '****************'+selectUser.patientCard.substr(-1, 1)}}
					</view>
					<view>证件类型：身份证</view>
				</view>
				<view class="user-buta" @click="show=true">更换就诊人</view>
			</view>

			<view class="flex-row">
				<view>科室名称</view>
				<view class="info-text">{{selectDoctor.deptName}}</view>
			</view>
			<u-line color="#E7E7E7"></u-line>
			<view class="flex-row">
				<view>医师名称</view>
				<view class="info-text">{{selectDoctor.docName}}</view>
			</view>
			<u-line color="#E7E7E7"></u-line>
			<view class="flex-row">
				<view>就诊日期</view>
				<view class="info-text">{{selectDoctor.date}}</view>
			</view>
			<u-line color="#E7E7E7"></u-line>
			<view class="flex-row">
				<view>挂号类型</view>
				<view class="info-text">预约挂号</view>
			</view>
			<u-line color="#E7E7E7"></u-line>
			<view class="flex-row">
				<view>挂号费用</view>
				<view class="info-text" style="color: #FF1212">￥{{selectDoctor.feeMoney}}</view>
			</view>
		</view>
		<view class="reslut-but">
			<view style="width: 329rpx;height: 85rpx;">
				<u-button type="primary" plain text="就诊卡余额挂号" @click="cardAppointment()"></u-button>
			</view>
			<view style="width: 329rpx;height: 85rpx;">
				<u-button type="primary" text="自费挂号" @click="cardAppointmentWx()"></u-button>
			</view>
		</view>
		<u-popup :show="show" mode="bottom" :round="10" @close="show = false">
			<view class="pop-con">
				<view class="pop-title">选择就诊人</view>
				<scroll-view scroll-y="true" class="scroll-y">
					<view class="user-list" v-for="(item,index) in userList" :key="index">
						<u-avatar :src="src" size="55"></u-avatar>
						<view class="list-text">
							<view style="font-weight: 500;color: #000000;font-size: 31rpx;">
								<u--text mode="name" :text="item.patientName" format="encrypt"></u--text>
							</view>
							<view>
								就诊卡号：{{item.patientCard.substr(0, 1) + '****************'+item.patientCard.substr(-1, 1)}}
							</view>
							<view>证件类型：身份证</view>
						</view>
						<view style="margin-left: auto;width: 128rpx;">
							<u-button type="primary" :plain="true" shape="circle" text="确定"
								@click="changeUser(item)"></u-button>

						</view>
					</view>
				</scroll-view>
				<view class="book-but">
					<u-button type="primary" text="添加就诊人"
						@click="goPage('/pages/bookbuilding/bookbuilding')"></u-button>

				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	import {
		userlistApi,
		registrationApi,
		createApi
	} from "@/api/user"
	export default {
		data() {
			return {
				show: false,
				src: '',
				selectUser: '',
				userList: [],
				selectDoctor: {},
				startTime: '',
				endTime: '',
			}
		},
		onLoad(option) {
			console.log(JSON.parse(decodeURIComponent(option.item)));
			this.selectDoctor = JSON.parse(decodeURIComponent(option.item));
			this.startTime = option.start
			this.endTime = option.end
			console.log(this.startTime, this.endTime);
			this.getUser()
		},
		methods: {
			async getUser() {
				let userInfo = uni.getStorageSync('userInfo')
				const res = await userlistApi({
					userId: userInfo.id,
					pageNum: 1,
					pageSize: 100,
					patientType: 1
				})
				this.userList = res.rows
				if (uni.getStorageSync('selectUser')) {
					this.selectUser = uni.getStorageSync('selectUser')


				} else {
					this.selectUser = this.userList[0]
					uni.setStorageSync('selectUser', this.userList[0])
				}


			},
			changeUser(item) {
				this.selectUser = item
				uni.setStorageSync('selectUser', item)
				this.show = false
			},
			async cardAppointment() {
				try {
					uni.showLoading({
						title: '挂号中...',
						mask: true
					})
					const res = await registrationApi({
						id: this.selectUser.id,
						asRowId: this.selectDoctor.asRowId,
						schedualNo: this.selectDoctor.schedualNo,
						money: this.selectDoctor.feeMoney,
						startTime: this.startTime,
						endTime: this.endTime,
						channel: 'CPP',
						date: this.selectDoctor.date,
					})
					uni.hideLoading()
					uni.navigateTo({
						url: '/pages/booksucceed/booksucceed'
					})
					// if (type === 'CPP') {

					// } else {
					// 	console.log(JSON.parse(res.msg));
					// 	this.wxpayOrder(JSON.parse(res.msg))
					// }
				} catch (e) {
					uni.hideLoading()
				}

			},
			async cardAppointmentWx() {
				try {
					uni.showLoading({
						title: '挂号中...',
						mask: true
					})
					const subdata = {
						patientId: this.selectUser.patientId,
						asRowId: this.selectDoctor.asRowId,
						schedualNo: this.selectDoctor.schedualNo,
						money: this.selectDoctor.feeMoney,
						startTime: this.startTime,
						endTime: this.endTime,
						date: this.selectDoctor.date,
					}
					const res = await createApi({
						id: this.selectUser.id,
						type: 4,
						money: this.selectDoctor.feeMoney,
						ext: JSON.stringify(subdata)
					})
					console.log(JSON.parse(res.msg));
					uni.hideLoading()
					this.wxpayOrder(JSON.parse(res.msg))

				} catch (e) {
					uni.hideLoading()
				}

			},
			wxpayOrder(data) {
				if (typeof WeixinJSBridge === 'undefined') {
					if (document.addEventListener) {
						document.addEventListener('WeixinJSBridgeReady', this.onBridgeReady(data), false)
					} else if (document.attachEvent) {
						document.attachEvent('WeixinJSBridgeReady', this.onBridgeReady(data))
						document.attachEvent('onWeixinJSBridgeReady', this.onBridgeReady(data))
					}
				} else {
					this.onBridgeReady(data)
				}
			},
			onBridgeReady(etr) {
				let that = this
				WeixinJSBridge.invoke( //这个对象只有微信浏览器支持
					'getBrandWCPayRequest', etr,
					function(res) {
						if (res.err_msg == 'get_brand_wcpay_request:ok') {
							uni.navigateTo({
								url: '/pages/booksucceed/booksucceed'
							})
						} else {
							uni.$u.toast('挂号失败')
						}
					})

			},
			goPage() {
				uni.navigateTo({
					url: '/pages/booksucceed/booksucceed'
				})
			},
		}
	}
</script>

<style scoped>
	.content {
		width: 100vw;
		min-height: 100%;
		background: #F8F8F8;
		color: #666666;
		font-size: 27rpx;
	}

	.info-con {
		width: 750rpx;
		padding: 0 31rpx;
		padding-top: 23rpx;
		box-sizing: border-box;
		background: #FFFFFF;
	}

	.flex-row {
		display: flex;
		align-items: center;
		padding: 21rpx 0;
	}

	.info-text {
		margin-left: 120rpx;
		color: #000000;
	}

	.user-lista {
		width: 688rpx;
		height: 185rpx;
		background: linear-gradient(135deg, #05A2FF 0%, #0CCFFF 100%);
		border-radius: 19rpx;
		padding: 31rpx;
		box-sizing: border-box;
		display: flex;
		align-items: center;
		color: #FFFFFF;
		font-size: 23rpx;
	}

	.list-texta {
		height: 100%;
		margin-left: 23rpx;
		display: flex;
		flex-direction: column;
		justify-content: space-between;

	}

	.user-buta {
		margin-left: auto;
		width: 146rpx;
		height: 62rpx;
		background: #FFFFFF;
		border-radius: 31rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		color: #05A2FF;
	}

	.reslut-but {
		display: flex;
		justify-content: space-between;
		margin: 0 31rpx;
		margin-top: 92rpx;

	}

	.pop-con {
		padding: 31rpx;
		box-sizing: border-box;
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.pop-title {
		width: 100%;
		text-align: center;
		font-weight: 500;
		color: #000000;
		font-size: 31rpx;
	}

	.scroll-y {
		height: 400rpx;
		width: 688rpx;
		margin-top: 31rpx;
		box-sizing: border-box;
	}

	.user-list {
		width: 688rpx;
		height: 190rpx;
		background: #FFFFFF;
		border-radius: 19rpx;
		padding-left: 19rpx;
		padding-right: 29rpx;
		padding-top: 23rpx;
		padding-bottom: 44rpx;
		box-sizing: border-box;
		display: flex;
		align-items: center;
		margin-bottom: 23rpx;
		box-shadow: 0px 0 13rpx 0px rgba(5, 162, 255, 0.11);
		color: #999999;
		font-size: 23rpx;
	}

	.list-text {
		height: 100%;
		margin-left: 23rpx;
		display: flex;
		flex-direction: column;
		justify-content: space-between;

	}

	.book-but {
		width: 688rpx;
		height: 85rpx;
		margin: 0 auto;
		margin-top: 31rpx;
	}
</style>